<template>
    <div id="seachDialog">
      <a-modal
        title="实际提成"
        v-model="mountData.show"
        width="450px"
        style="overflow:hidden"
        @cancel="handleClose">
        <el-row style="padding:20px">
            <el-col :span="24">
                <el-form :model="parames" size="small" :rules="rules" label-position="left" ref="parames" label-width="94px">
                    <el-form-item label="实际提成:" prop="actualCommission">
                        <el-input size="small" type="number" v-model="parames.actualCommission" placeholder="请输入"></el-input>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
        <span slot="footer" class="dialog-footer">
            <el-button size="small" type="primary" @click="handleSend">保存</el-button>
            <el-button size="small" @click="handleClose">取消</el-button>
        </span>
      </a-modal>
    </div>
</template>

<script>
export default {
    props: ['mountData'],
    data() {
        return {
          parames: {
              actualCommission: '',
          },
          rules: {
            actualCommission: [{ required: true, message: '必填', trigger: ['change','blur' ]}]
          },
        };
    },
    methods: {
        handleClose () {
            this.mountData.show = false
        },
        handleSend () {//提交签单绩效
            this.$refs['parames'].validate((valid) => {
                if (valid) {
                    if (this.mountData.type == 'qiandan') {
                        this.$post(this.$api.postPerformanceSubmitSigningVerification,{
                            contractProductId: this.mountData.contractProductId,
                            actualCommission: this.parames.actualCommission
                        }).then(response => {
                            if (response.data.succeed) {
                                this.$emit('checkRender')
                                this.handleClose()
                            }
                        })
                    } else if (this.mountData.type == 'fuwu') {
                        this.$post(this.$api.postPerformanceSubmitServiceVerification,{
                            disposableMark: this.mountData.disposableMark,
                            taskId: this.mountData.taskId,
                            actualCommission: this.parames.actualCommission
                        }).then(response => {
                            if (response.data.succeed) {
                                this.$emit('checkRender')
                                this.handleClose()
                            }
                        })
                    }
                }
            })
        },
        resetData () {
            this.parames.actualCommission = ''
            this.$refs.parames.resetFields()
        }
    },
    computed: {
      changeDialog () {
        return this.mountData.show
      }
    }, 
    watch: {
      changeDialog: {
        handler (curVal, oldVal) {
          if (curVal) {
            
          } else {
            this.resetData()
          }
        }
      }
    }
};
</script>

<style>
#seachDialog .el-dialog{
    padding-bottom: 0; 
    overflow-x: hidden;
}
#seachDialog .el-dialog__footer{
    border-top: #f4f4f4 solid 1px;
}
.title-row:hover{
  background: #f9f9f9;
}
</style>
